import React, {Component} from 'react'
import {LoadingWrapper} from "./styled";
import { connect } from 'react-redux'


class Loading extends Component {
    render() {
        const {show} = this.props
        let styleObj = {display: show ? 'block': 'none'}
        return (
            <LoadingWrapper>
                <div className="ajax-loading" style={styleObj}>
                    <div className="overlay"></div>
                    <div className="loading">
                        <img src="https://media.number-7.cn/ebike-h5/static/images/common/loading.gif" alt=""/>
                        <span>加载中，请稍后...</span>
                    </div>
                </div>
            </LoadingWrapper>
        )
    }
}

const mapState = (state) => ({
    show: state.getIn(['loading','show'])
})



export default connect(mapState, null)(Loading)
